<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns:th="https://www.thymeleaf.org">
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no">
    <!-- <script th:src="@{/js/jquery-1.12.4.js}"  type="text/javascript"></script>-->
    <link th:href="@{/css/shop.css}" type="text/css" rel="stylesheet" />
    <link th:href="@{/css/Sellerber.css}" type="text/css"  rel="stylesheet" />
    <link th:href="@{/css/bkg_ui.css}" type="text/css"  rel="stylesheet" />
    <link th:href="@{/font/css/font-awesome.min.css}"  rel="stylesheet" type="text/css" />
    <script th:src="@{/js/jquery-1.9.1.min.js}" type="text/javascript" ></script>
    <script type="text/javascript" th:src="@{/js/jquery.cookie.js}"></script>
    <script th:src="@{/js/shopFrame.js}" type="text/javascript"></script>
    <script th:src="@{/js/Sellerber.js}" type="text/javascript"></script>
    <script th:src="@{/js/layer/layer.js}" type="text/javascript"></script>
    <script th:src="@{/js/laydate/laydate.js}" type="text/javascript"></script>
    <script type="text/javascript" th:src="@{/js/proTree.js}" ></script>
    <!--[if lt IE 9]>
    <script th:src="@{/js/html5shiv.js}" type="text/javascript"></script>
    <script th:src="@{/js/respond.min.js}"></script>
    <script th:src="@{/js/css3-mediaqueries.js}"  type="text/javascript"></script>
    <![endif]-->
    <script th:src="@{/js/commodity/products.js}"  type="text/javascript"></script>
    <title>产品列表</title>

</head>
<body>
<div class="margin" id="page_style">
    <div class="operation clearfix mb15 same_module">
        <!--<ul class="choice_search">
            <li class="clearfix col-xs-3 col-lg-3 col-ms-3 "><label class="label_name ">产品名称：</label><input name="" type="text" class="form-control col-xs-8 col-lg-8 col-ms-8"></li>
            <li class="clearfix col-xs-5 col-lg-5 col-ms-5 "><label class="label_name ">添加时间：</label>
                <input class="laydate-icon col-xs-4 col-lg-3 form-control Select_Date" id="start" >
                <span style=" float:left; padding:0px 10px; line-height:32px;">至</span>
                <input class="laydate-icon col-xs-4 col-lg-3 form-control Select_Date" id="end">
                <button class="btn button_btn bg-deep-blue " onclick="" type="button"><i class="fa  fa-search"></i>&nbsp;搜索</button></li>
        </ul>-->
    </div>
    <!--列表展示-->
    <div class="h_products_list clearfix" id="Sellerber">
        <!--<div class="Sellerber_left menu" id="menuBar">
            <div class="show_btn" id="rightArrow"><span></span></div>
            <div class="side_title"><a title="隐藏" class="close_btn"><span></span></a></div>
            <div class="menu_style" id="menu_style">
                <div class="list_content">
                <div class="list_content">
                    <div class="side_list">
                        <div class="column_title"><h4 class="lighter smaller">产品类型列表</h4></div>
                        <div class="st_tree_style tree">
                        </div>
                    </div>
                </div>
            </div>
        </div>-->
        <div class="list_Exhibition list_show padding15">
            <div class="operation clearfix mb15 searchs_style">
                <!--<button class="btn button_btn btn-danger" type="button" onclick=""><i class="fa fa-trash-o"></i>&nbsp;删除</button>
                <span class="submenu">
<a href="add_product.html" name="" class="btn button_btn bg-deep-blue" title="添加产品"><i class="fa  fa-edit"></i>&nbsp;添加产品</a>
<a href="add_product.html" name="" class="btn button_btn bg-deep-blue" title="添加产品"><i class="fa  fa-edit"></i>&nbsp;添加分类</a>
</span>
                <div class="search  clearfix">
                    <label class="label_name">商品搜索：</label><input name="" type="text"  class="form-control col-xs-5"/><button class="btn button_btn bg-deep-blue " onclick=""  type="button"><i class="fa  fa-search"></i>&nbsp;搜索</button>
                    <span>数量：3433件</span>
                </div>-->
                <ul class="choice_search">
                    <li class="clearfix col-xs-3 col-lg-3 col-ms-3 "><label class="label_name ">商品名称：</label><input name="" type="text" class="form-control col-xs-8 col-lg-8 col-ms-8" id="commodityName"></li>
                    <li class="clearfix col-xs-6 col-lg-6 col-ms-6 "><label class="label_name ">演出时间：</label>
                        <input class="laydate-icon col-xs-4 col-lg-3 form-control Select_Date" style="width: 200px" id="start" >
                        <span style=" float:left; padding:0px 10px; line-height:32px;">至</span>
                        <input class="laydate-icon col-xs-4 col-lg-3 form-control Select_Date" style="width: 200px" id="end">
                    </li>

                    <li class="clearfix col-xs-3 col-lg-3 col-ms-3 ">
                        <label class="label_name ">商品评星：</label>
                        <div id="xingji">
                            <img class="img" id="1" th:src="@{/product_img/logo/star-off.png}">
                            <img class="img" id="2" th:src="@{/product_img/logo/star-off.png}">
                            <img class="img" id="3" th:src="@{/product_img/logo/star-off.png}">
                            <img class="img" id="4" th:src="@{/product_img/logo/star-off.png}">
                            <img class="img" id="5" th:src="@{/product_img/logo/star-off.png}">
                        </div>
                    </li>
                    <li class="clearfix col-xs-3 col-lg-3 col-ms-3 ">
                        <label class="label_name ">省会名称：</label>
                        <select class="select Competence_sort" name="admin-role" size="1"
                                id="provinceList">
                            <option value="0">请选择省会名称：</option>
                        </select>
                    </li>
                    <li class="clearfix col-xs-3 col-lg-3 col-ms-3 ">
                        <label class="label_name ">城市名称：</label>
                        <select class="select Competence_sort" name="admin-role" size="1"
                                id="cityList">
                            <option value="0">请选择城市名称：</option>
                        </select>
                    </li>
                    <li class="clearfix col-xs-3 col-lg-3 col-ms-3 ">
                        <label class="label_name ">大类型：</label>
                        <select class="select Competence_sort" name="admin-role" size="1"
                                id="typeList">
                            <option value="0">请选择类型名称：</option>
                        </select>
                    </li>
                    <li class="clearfix col-xs-3 col-lg-3 col-ms-3 ">
                        <label class="label_name ">小类型：</label>
                        <select class="select Competence_sort" name="admin-role" size="1"
                                id="smallTypeList">
                            <option value="0">请选择类型名称：</option>
                        </select>
                    </li>


                    <li class="clearfix col-xs-3 col-lg-3 col-ms-3 ">
                        <label class="label_name ">商品状态：</label>
                        <select class="select Competence_sort" name="admin-role" size="1"
                                id="statusList">
                            <option value="0">请选择商品状态</option>
                            <option value="1">下架</option>
                            <option value="2">上架</option>
                            <option value="3">暂停售卖</option>
                            <option value="4">过期</option>
                        </select>
                    </li>


                    <li class="clearfix col-xs-3 col-lg-3 col-ms-3 ">
                        <label class="label_name ">能否选座：</label>
                        <label >
                            <input type="radio" name="isSeat" value="0" checked="checked">忽略
                        </label>
                        <label >
                            <input type="radio" name="isSeat" value="1">能
                        </label>
                        <label >
                            <input  type="radio" name="isSeat" value="2">不能
                        </label>

                        <!--<select class="select Competence_sort" name="admin-role" size="1"
                                id="isSeatList">
                            <option value="0">请选择是否可以选座</option>
                            <option value="1">是</option>
                            <option value="2">否</option>
                        </select>-->
                    </li>

                    <button class="btn button_btn bg-deep-blue " id="select" type="button"><i class="fa  fa-search"></i>&nbsp;搜索</button>
                </ul>
            </div>
            <div class="datalist_show">
                <div class="datatable_height confirm">

                    <table class="table table_list table_striped table-bordered" id="">
                        <thead>
                        <th width="25px"><label><input type="checkbox" class="ace"><span class="lbl"></span></label></th>
                        <th width="50px">商品编号</th>
                        <th width="50px">分类</th>
                        <th width="120px">城市</th>
                        <th width="180px">商品名称</th>
                        <th width="180px">开始时间---结束时间</th>
                        <th width="100px">商品评星(1-5星)</th>
                        <th width="80px">商品状态</th>
                        <th width="80px">是否可选择座位</th>
                        <th width="80px">商品限购数量</th>
                        <th width="200px">操作</th>
                        </thead>
                        <tbody id="showTable">

                        </tbody>

                    </table>
                    <div style="text-align: center;margin-top: 2%">
                        <a id="homePage">首页</a>
                        <a id="lastPage">上一页</a>
                        <a id="nextPage">下一页</a>
                        <a id="trailerPage">尾页</a>
                        <a >当前页数第<span id="thisPage"></span>页/</a>
                        <a >共有<span id="sumPage"></span>页</a>
                    </div>
                </div>

            </div>

        </div>
    </div>
</div>
</body>
</html>
<script type="text/javascript">
    //设置内页框架布局
    $(function() {
        $("#Sellerber").frame({
            float : 'left',
            color_btn:'.skin_select',
            Sellerber_menu:'.list_content',
            page_content:'.list_show',//内容
            datalist:".datatable_height",//数据列表高度取值
            header:65,//顶部高度
            mwidth:200,//菜单栏宽度
        });
    });
    //后台传入的 标题列表
    var arr = [{
        id: 1,
        name: "食品/酒类/特产",
        amount:234,
        pid: 0,

    }, {
        id: 2,
        name: "数码家电",
        amount:64,
        pid: 0,

    }, {
        id: 3,
        name: "家具/家居",
        amount:64,
        pid: 0,

    }, {
        id: 4,
        name: "电脑办公",
        amount:64,
        pid: 0,

    }, {
        id: 5,
        name: "图书影响",
        amount:64,
        pid: 0,

    }, {
        id: 6,
        name: "母婴用品",
        amount:64,
        pid: 0,

    }, {
        id: 13,
        name: "牛奶",
        amount:64,
        pid:1
    }, {
        id: 14,
        name: "面包",
        amount:64,
        pid:1
    }, {
        id: 15,
        name: "饼干",
        amount:64,
        pid:1
    }, {
        id: 16,
        name: "白酒",
        amount:64,
        pid:1
    }, {
        id: 17,
        name: "啤酒",
        amount:64,
        pid:1
    },  {
        id: 18,
        name: "红酒",
        amount:64,
        pid:1
    }, {
        id: 19,
        name: "音响",
        amount:64,
        pid:2
    }, {
        id: 20,
        name: "冰箱",
        amount:64,
        pid:2
    }, {
        id: 21,
        name: "洗衣机",
        amount:64,
        pid:2
    }, {
        id: 21,
        name: "洗衣机",
        amount:64,
        pid:3
    }, {
        id: 21,
        name: "洗衣机",
        amount:64,
        pid:4
    }, {
        id: 21,
        name: "洗衣机",
        amount:64,
        pid:5
    }

    ];
    //树状图插件
    $(".tree").ProTree({
        arr: arr,//数据
        simIcon: "fa fa-file-text-o",//单个标题字体图标 不传默认glyphicon-file
        mouIconOpen: "fa fa-folder-open",//含多个标题的打开字体图标  不传默认glyphicon-folder-open
        mouIconClose:"fa fa-folder",//含多个标题的关闭的字体图标  不传默认glyphicon-folder-close

    })
    /******时间设置*******/
    var start = {
        elem: '#start',
        format: 'YYYY-MM-DD',
        // min: laydate.now(), //设定最小日期为当前日期
        max: '2099-06-16', //最大日期
        istime: true,
        istoday: false,
        choose: function(datas){
            end.min = datas; //开始日选好后，重置结束日的最小日期
            end.start = datas //将结束日的初始值设定为开始日
        }
    };
    var end = {
        elem: '#end',
        format: 'YYYY-MM-DD',
        //min: laydate.now(),
        max: '2099-06-16',
        istime: true,
        istoday: false,
        choose: function(datas){
            start.max = datas; //结束日选好后，重置开始日的最大日期
        }
    };
    laydate(start);
    laydate(end);
    /*产品-停用*/
    function member_stop(obj,id){
        layer.confirm('确认要下架该产品吗？',function(index){
            $(obj).parents("tr").find(".td-manage").prepend('<a style="text-decoration:none" class="btn btn-xs " onClick="member_start(this,id)" href="javascript:;" title="上架">上架</a>');
            $(obj).parents("tr").find(".td-status").html('<span class="label label-defaunt radius">已下架</span>');
            $(obj).remove();
            layer.msg('已下架!',{icon: 5,time:1000});
        });
    }
    /*产品-启用*/
    function member_start(obj,id){
        layer.confirm('确认要上架改该产品吗？',function(index){
            $(obj).parents("tr").find(".td-manage").prepend('<a style="text-decoration:none" class="btn btn-xs btn-status" onClick="member_stop(this,id)" href="javascript:;" title="下架">下架</a>');
            $(obj).parents("tr").find(".td-status").html('<span class="label label-success radius">已上架</span>');
            $(obj).remove();
            layer.msg('已上架!',{icon: 6,time:1000});
        });
    }
    /*产品-编辑*/
    function member_edit(title,url,id,w,h){
        layer_show(title,url,w,h);
    }

</script>